<template>
	<view class="wrap">
		<block v-if="pageType=='chargeOff'">
			<write-off-coupon></write-off-coupon>
		</block>
		<block v-else>
			<view class="main">
				<view class="item">
					<view class="item-L">名称</view>
					<view class="item-R">
						<text class="goodsName">{{infoByCode.productName}}</text>
						<!-- <input type="text" v-model="infoByCode.productName" disabled> -->
						<!-- <input type="text" v-model="infoByCode.productName" placeholder="请输入名称" disabled> -->
					</view>
				</view>
				<view class="item">
					<view class="item-L">颜色</view>
					<view class="item-R">
						<input type="text" v-model="infoByCode.colorName" disabled>
						<!-- <input type="text" v-model="infoByCode.colorName" placeholder="请输入颜色" disabled> -->
					</view>
				</view>
				<view class="item">
					<view class="item-L">色号</view>
					<view class="item-R">
						<input type="text" v-model="infoByCode.colorId" disabled>
						<!-- <input type="text" v-model="infoByCode.rollNo" placeholder="请输入卷号" disabled> -->
					</view>

				</view>
				<view class="item">
					<view class="item-L">缸号</view>
					<view class="item-R">
						<input type="text" v-model="infoByCode.vatNo" disabled>
						<!-- <input type="text" v-model="infoByCode.vatNo" placeholder="请输入缸号" disabled> -->
					</view>
				</view>
				<view class="item">
					<view class="item-L">数量</view>
					<view class="item-R">
						<input type="text" v-model="infoByCode.amount" placeholder="请输入数量">
						<text style="margin-left: 12rpx;">条</text>
						<!-- <text style="margin-left: 20rpx;">{{infoByCode.unit}}</text> -->
					</view>
				</view>
			</view>
		</block>
		<view class="btn">
			<g-btn v-if="pageType == 'addGoods'" title="添加商品"></g-btn>
			<g-btn v-if="pageType == 'inStorage'" title="确认入库" @click="inStorageTap"></g-btn>
			<g-btn v-if="pageType == 'outStorage'" title="确认出库" @click="outStorageTap"></g-btn>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageType: '',
				repoId: '',
				infoByCode: {
					// colorId: "12"
					// colorName: "天蓝色"
					// freightNo: "货号-001"
					// productName: "精选亚麻布料"
					// repoId: 6
					// rollNo: "卷号1"
					// skuId: "80001"
					// unit: "公斤"
					// vatNo: "缸号1"
				},
			}
		},
		onLoad(options) {
			// this.pageType = uni.getStorageSync('pageType') || ''
			let pageType = options.pageType || ''
			this.pageType = pageType
			this.repoId = options.scanResult
			if (pageType === 'chargeOff') {
				this.getCouponInfo()
			} else {
				this.getInfoByCode()
			}
		},
		onReady() {
			let title = '布导航'
			let pageType = this.pageType
			if (pageType === 'addGoods') {
				title = '扫码出库'
			} else if (pageType === 'inStorage') {
				title = '扫码入库'
			} else if (pageType === 'outStorage') {
				title = '扫码出库'
			} else if (pageType === 'chargeOff') {
				title = '核销优惠券'
			}
			uni.setNavigationBarTitle({
				title
			})
		},
		methods: {
			getCouponInfo() {
				uni.request({
					url: `${this.$g_config.requestUrl}${this.repoId}`,
					success: ({
						data
					}) => {
						console.log(data);
						if (data && data.code == 0) {
							this.infoByCode = data.data
						}
					}
				})
			},
			getInfoByCode() {
				if (this.pageType !== 'outStorage') return
				uni.request({
					url: `${this.$g_config.requestUrl}${this.repoId}`,
					success: ({
						data
					}) => {
						console.log(data);
						if (data && data.code == 0) {
							this.infoByCode = data.data
						}
					}
				})
				// this.$g_api.repositoryGetRepoInfo({
				// 	repoId: this.repoId
				// }).then(({
				// 	data
				// }) => {
				// 	if (data) {
				// 		this.infoByCode = data
				// 	}
				// })
			},
			inStorageTap() {
				if (!this.repoId) {
					uni.showToast({
						title: '入库失败',
						icon: 'none'
					})
					return
				}
				if (!this.infoByCode.amount) {
					uni.showToast({
						title: '请输入入库数量',
						icon: 'none'
					})
					return
				}
				this.$g_api.repositoryIn({
					...this.infoByCode,
					amount: this.infoByCode.amount,
					id: this.repoId
				}).then(({
					data
				}) => {
					uni.showToast({
						title: '入库成功'
					})
				})
			},
			outStorageTap() {
				if (!this.infoByCode?.repoId) {
					uni.showToast({
						title: '出库失败',
						icon: 'none'
					})
					return
				}
				if (!this.infoByCode?.amount) {
					uni.showToast({
						title: '请输入出库数量',
						icon: 'none'
					})
					return
				}
				this.$g_api.repositoryOut({
					amount: this.infoByCode.amount,
					id: this.infoByCode.repoId
				}).then(({
					data
				}) => {
					uni.showToast({
						title: '出库成功'
					})
					uni.$emit('update-inventory')
					setTimeout(() => {
						uni.navigateBack()
					}, 1000)
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.main {
		margin-top: 20rpx;

	}

	.item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 100rpx;
		padding: 0 30rpx;
		background-color: #fff;
		border-bottom: 1px solid $g-border-color;
	}

	.item-L {
		flex-shrink: 0;
		font-size: 30rpx;
		color: #808080;
	}

	.item-R {
		margin-left: 100rpx;
		flex: 1;
		display: flex;
		align-items: center;
		font-size: 30rpx;
		color: #333;

		input {
			flex: 1;
			text-align: right;
		}
	}

	.btn {
		margin-top: 150rpx;
	}

	.goodsName {
		text-align: right;
		margin-left: 30rpx;
		width: 500rpx;
		// width: 100%;
		display: block;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	}
</style>
